<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }

        .navtext {
            white: 100px;
            text-align: center;
            font-size: 30px;
        }

        li {
            list-style: none;
        }

        /* .fromlist {
            text-align: center;
        } */
        .froms {
            display: flex;
        }

        .ulo {
            flex: 1;
            text-align: right;
        }

        .ult {
            flex: 1;
        }

        .list1 {
            position: relative;
            width: 40%;
            left: 60%;
            line-height: 40px;
        }

        .list2 {
            width: 40%;
            line-height: 40px;
        }
    </style>
    <script src="../static/index.js"></script>
</head>
<body>
<nav class="navtext">商品出库</nav>
<div class="fromlist">
    <form th:action="@{add.html}" method="post" class="froms">
        <ul class="ulo">
            <li class="list1">出库商品：</li>
            <li class="list1">数量：</li>
            <li class="list1">经手人：</li>
            <li class="list1"><input type="submit" value="提交"/></li>
        </ul>
        <ul class="ult">
            <li class="list2"><select name="productId" id="productId">
                <option value="0">--请选择出库商品--</option>
                <option th:each="list,index:${list}" th:value="${list.id} " th:text="${list.productName}"></option>
            </select></li>
            <li class="list2"><input type="text" name="product"/></li>
            <li class="list2"><input type="text" name="takeman"/></li>
            <li class="list2"><input type="button" value="重置"/></li>
        </ul>
    </form>
</div>
<script th:src="@{static/jquery-1.12.4.js}" type="application/javascript"></script>
<script th:src="@{static/index.js}" type="application/javascript"></script>
</body>
</html>